<template>
  <div class="newlist">
    <div class="header-warpper" @click="$router.back(-1)">
      <img style="margin-top: -.16rem;" src="../../assets/l_jt.png" alt />
      <span>公告详情</span>
    </div>
    <ul class="mui-newslist-container">
      <li class="mui-newlist-item">
        <h3>{{title}}</h3>
        <span class="font-lightGray-30">{{time}}</span>
        <div class="content" v-html="content"></div>
      </li>
    </ul>
    <div style="height:1.333333rem"></div>
    <Tabbar :idx="5" />
  </div>
</template>

<script>
// @ is an alias to /src
import Tabbar from "@/views/public/Tabbar.vue";

export default {
  name: "newlist",
  components: {
    Tabbar
  },
  data() {
    return {
      id: "",
      title: "",
      content: "",
      time: ""
    };
  },
  created: function() {
    let id = this.$route.query.id;

    this.$axios
      .post("/index/apiindex/articlelog", { article_id: id })
      .then(res => {
        console.log(res);
        if (res.data.code == 0) {
          if (res.data.info.length > 0) {
            this.title = res.data.info[0].title;
            this.time = res.data.info[0].create_time;
            this.content = res.data.info[0].content;
          } else {
            // console.log(1)
            alert("暂无记录");
          }
        } else {
          alert(res.data.message);
        }
      });
  },
  mounted() {},
  methods: {}
};
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped lang="less">
.f-flex {
  display: flex;
  display: -webkit-flex;
  align-items: center;
}
.newlist {
  .mui-newslist-container {
    padding-left: 0.4rem;
    .mui-newlist-item {
      text-align: left;
      padding: 0.586667rem;
      padding-left: 0;
      padding-top: 0.1rem;
      h3 {
        text-align: left;
        font-weight: bold;
        color: #10131e;
        font-size: 0.48rem;
        line-height: 1;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        padding-bottom: 0.266667rem;
        height: 0.6rem;
        line-height: 0.6rem;
      }
      .font-lightGray-30 {
        font-size: 0.346667rem;
        color: #7e87a2;
        text-align: left;
      }
    }
  }
}
.content {
  width: 100%;
  // 字体换行  字母换行
  word-break: break-word;
}
.content img {
  width: 100%;
}
</style>

